<!doctype html>
<html lang="en">
<head>
	<meta charset="utf-8" />
	<link rel="icon" type="image/png" href="{{ url_for('static', filename='favicon.png') }}">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

	<title>FAME - {% block title %} {% endblock %}</title>

	<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
    <meta name="viewport" content="width=device-width" />

    <!-- Bootstrap core CSS     -->
    <link href="{{ url_for('static', filename='css/bootstrap.min.css') }}" rel="stylesheet" />

    <!-- Template CSS -->
    <link href="{{ url_for('static', filename='css/template.css') }}" rel="stylesheet"/>

    <!-- FAME CSS -->
    <link href="{{ url_for('static', filename='css/animate.css') }}" rel="stylesheet"/>
    <link href="{{ url_for('static', filename='css/fame.css') }}" rel="stylesheet" />

    <!-- Fonts and icons -->
    <link href="{{ url_for('static', filename='css/font-awesome.min.css')}}" rel="stylesheet">
    <link href='https://fonts.googleapis.com/css?family=Roboto:400,700,300' rel='stylesheet' type='text/css'>
    <link href="{{ url_for('static', filename='css/pe-icon-7-stroke.css')}}" rel="stylesheet" />

    <script src="{{ url_for('static', filename='js/jquery-1.11.3.min.js') }}" type="text/javascript"></script>
    <script src="{{ url_for('static', filename='js/bootstrap.min.js') }}" type="text/javascript"></script>
    <script src="{{ url_for('static', filename='js/template.js') }}"></script>
    <script src="{{ url_for('static', filename='js/bootstrap-notify.min.js') }}"></script>
</head>
<body>


<div class="wrapper wrapper-full-page">
    <div class="full-page login-page" data-color="azure" data-image="{{ url_for('static', filename='img/computer_code.jpg') }}">

        <div class="content">
            <div class="container">
                <div class="row">
                    <div class="col-md-4 col-sm-6 col-md-offset-4 col-sm-offset-3">
                        {% block body %} {% endblock %}
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>


{% with messages = get_flashed_messages(with_categories=true) %}
  {% if messages %}
    <script>
    {% for category, message in messages %}
      $.notify({
          message: "{{message}}"
      }, {
          offset: {
              y: 50,
              x: 30
          },
          type: "{{category}}"
      });
    {% endfor %}
    </script>
  {% endif %}
{% endwith %}

<script type="text/javascript">
    $().ready(function(){
        lbd.checkFullPageBackgroundImage();
    });
</script>


</body>
</html>
